<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>js拖拽特效</title>
  <link rel="stylesheet" href="../../css/common.css">
  <link rel="stylesheet" href="index.css">
</head>

<body>
  <div class="container">
    <!-- 属性draggable="true"表示启用元素拖动  -->
    <div id="dnd" draggable="true">拖</div>

    <button id="btnOpen">弹出对话框</button>

  </div>

  <!-- 弹出层 -->
  <div id="mask">
    <div id="content">
      <div>一个弹出对话框<span id="spClose">X</span></div>
      <hr>
      <div>
        凡是重要的电影都是以黑色屏幕开头的
        <br>
        黑暗骑士
      </div>
      <hr>
      <div>
        <button id="btnClose">关闭</button>
      </div>
    </div>
  </div>


  <script src="index.js"></script>
</body>

</html>